{extend name="admin@index_layout"/}
{block name="main"}
<style type="text/css">
.cmdlist-container {
    background: #fff;
    border: 1px solid;
    border-color: #ecebeb #e1e0e0 #d5d5d5 #e1e0e0;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.1);
}

.cmdlist-container img {
    padding: 5%;
    width: 90%;
}
.cmdlist-text {
    padding: 0 10px 0;
    line-height: 2;
}
.cmdlist-container .ft{
    background: #f8f8f8;
    border-top: 1px solid #eeeeee;
    padding: 5px;
    border-bottom: 1px solid #fff;
}
</style>
<div class="layui-card">
    <div class="layui-card-header">主题管理</div>
    <div class="layui-card-body">
        <div class="layui-row layui-col-space30">
            {volist name="themes" id="vo"}
            <div class="layui-col-md2 layui-col-sm4">
                <div class="cmdlist-container"><img src="{$vo.preview}">
                    <div class="cmdlist-text">
                        <p class="info">{$vo.name}</p>
                    </div>
                    <div class="ft">
                        {if isset($vo['use']) && $vo['use']==1}
                        <button class="layui-btn layui-btn-sm layui-btn-disabled layui-btn-fluid">已使用</button>
                        {else /}
                        <a href="{:url('template/theme/chose',['theme'=>$vo['name']])}" class="layui-btn layui-btn-sm layui-btn-fluid ajax-get confirm">选择使用</a>
                        {/if}
                    </div>
                </div>
            </div>
            {/volist}
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script type="text/javascript" src="__STATIC__/admin/js/common.js"></script>
{/block}